<?php
    if(!$this->session->userdata('logged_in')) {
        redirect('logout');
    }
?>
<a name='subd_section'></a>

<div id="choose_groups_section">
    <ul>
        <li id='li_my_groups'><a href='#subd_section' onclick='shade_my()'>My Groups</a></li>
        <li id='li_subscribables'><a href='#subable_section' onclick='shade_others()'>Subscribe to Groups</a></li>
        
    </ul>
</div>


<div class="page_header_groups">
    <p class='p_header'>My Groups</p>
    <div class='group_filters_div'>
        <p class='p_view_by'>Sort by:</p>
        <ul class='ul_group_view_by'>
            <li><a href='../authenticated/groupnamesort'>Group Name</a></li>
            <li><a href='../authenticated/groups'>Date Joined</a></li>
            <li id="li_visit_group">
                <form action="../authenticated/search-group" method="post">
                    <input type="text" class="txt_goToGroup" name="txt_goToGroup" />
                    <input type="submit" name="btn_goToGroup" class="btn_goToGroup" value="Search Group" />
                </form>
            </li>   
        </ul>
    </div>
</div>
<div id="subscribed_groups_id">
    <?php
        if(count($my_groups) == 0) {
            echo "<p class='p_no_group'>You are not yet subscribed to any group.</p>";
        }
        else {
        foreach($my_groups as $mine) {
            $group_id = $mine['group_id'];
            $group_name = $mine['group_name'];
            $description = $mine['group_desc'];
            
            if(strlen($description) >= 135)
                $description = substr_replace($description, "", 135)."...";
            
            $month = date('M', strtotime($mine['date_subscribed']));
            $year = date('Y', strtotime($mine['date_subscribed']));
            $day =  date('d', strtotime($mine['date_subscribed']));
            $date_subscribed = $month.' '.' '.$day.', '.$year;
            
            $is_forced = $mine['is_forced'];
    ?>        
                <div class='subscribe_groups_class' onclick='window.location.href = "groups/<?php echo $group_id; ?>"'>
                <p class="group_title"><?php echo $group_name; ?></p>
                <p class="group_description"><?php echo $description; ?></p>
                
                <div class='bottom_level'>
                <?php
                    if($is_forced == 0) {
                        echo '<a href="confirm/'. $group_id.'" class="btnUnsub" name="btnUnsubscribe" title="Unsubscribe from this group">UNSUBSCRIBE</a>';
                        echo "<div class='group_date'>Member since: $date_subscribed</div>";
                    }
                    else if($is_forced == 1) {
                        echo "<a class='btnUnsub' id='btnCannotUnsub' name='btnUnsubscribe'>You are not allowed to unsubscribe.</a>";
                        //echo "<div class='group_date_up'>Member since: $date_subscribed</div>";
                    }
                    ?>
                
                </div>
                
                </div>
            <?php
               foreach($mine['admins'] as $admin) {
               $admin_fname = $admin['fname'];
               $admin_lname = $admin['lname'];
            ?>
               
            <?php } ?>
           
        <?php   }} ?>
    
</div>

<a name='subable_section'></a>
<!--<p class="page_header_groups" id='subable_section_heading'>Subscribable Groups</p>-->

<!--<div class='p_back'><a href='#subd_section' onclick='shade_my()'>Back to My Groups</a></div>-->
<?php //
        
                  
//        echo "<div class='up_img' onclick='shade_my()' title='Back to Groups'><a href='#subd_section'>".img($img_props)."</a></div>"; 
    ?>

<div class="page_header_groups">
    <p class='p_header'>More Subscribable Groups
        <form action="../authenticated/search-subgroup#subable_section" method="post" id="search_form">
                    <input type="text" class="txt_goToGroup" name="txt_goToSubGroup" />
                    <input type="submit" name="btn_goToSubGroup" class="btn_goToGroup" value="Search Group" />
        </form></p>
</div>
<div id="subscribable_groups_id">
    
    <?php
        if(count($more_groups) == 0) {
            echo "<p class='p_no_group'>There are no Groups to show</p>";
        }
        foreach($more_groups as $more) {
            $group_id = $more['group_id'];
            $group_name = $more['group_name'];
            $description = $more['group_desc'];
            //$date_created = $more['date_created'];
            
            if(strlen($description) >= 135)
                $description = substr_replace($description, "", 135)."...";
    ?>
            <div class='subscribable_groups_class'>
                <p class="group_title"><?php echo $group_name; ?></p>
                <p class="group_description"><?php echo $description; ?></p>
                <?php echo '<a href="confirm-subscribe/'.$group_id .'" class="btnSubscribe" name="btnSubscribe" title="Subscribe to this group">SUBSCRIBE</a>'; ?>
            </div>
     <?php   } ?>
    
    <div id='back_bottom'>
        <div class='p_back'><a href='#subd_section' onclick='shade_my()'>Back to My Groups</a></div>
        <?php
            $img_props = array (
                'src' => 'resources/images/btn_up.png',
                'alt' => 'Back Button',
                'class' => 'image',
                'width' => '35',
                'height' => '35'
            );
            echo "<div class='up_img' onclick='shade_my()' title='Back to Groups'><a href='#subd_section'>".img($img_props)."</a></div>";  
        ?>
    </div>
</div>




<script>
  var tiles1 = document.getElementsByClassName('subscribable_groups_class');
  for(var i = 0; i < tiles1.length; i++) {
      var tile = tiles1[i];
      var color = get_random_color();
      tile.style.background = get_random_color();
      
  }
 
function get_random_color() {
    var letters = '798abc'.split('');
    var color = '#';
    for (var i = 0; i < 6; i++ ) {
        color += letters[Math.round(Math.random() * 5)];
    }
    return color;
}


function shade_my() {
    var my_groups = document.getElementById('li_my_groups');
    var unshade = document.getElementById('li_subscribables');
    
    my_groups.style.background = '#cccccc';
    my_groups.style.border = 'solid 1px gray';
    
    unshade.style.background = '#ffffff';
    unshade.style.border = 'none';
}

function shade_others() {
    var subscribables = document.getElementById('li_subscribables');
    var unshade = document.getElementById('li_my_groups');
    
    subscribables.style.background = '#cccccc';
    subscribables.style.border = 'solid 1px gray';
    
    unshade.style.background = '#ffffff';
    unshade.style.border = 'none';
}


</script>
    